<template>
  <div class="flex-h order-settlemet-wrapper">
    <div class="flex-v flex-hc order-info">
      <div class="fontsize32">
        <span class="total-txt">合计：</span>
        <span class="total-value">¥{{orderTotalPrice}}元</span>
      </div>
      <!-- <div class="fontsize28 order-count">
        <span>订单：</span>
        <span>×{{orderCount}}</span>
      </div> -->
    </div>
    <div
      class="fontsize32 total-price"
      @click="clickSettlement"
    >
      去结算&nbsp;&nbsp;>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    orderTotalPrice: {
      type: Number,
      default: 12.01
    },
    orderCount: {
      type: Number,
      default: 5
    }
  },
  methods: {
    clickSettlement() {
      this.$emit('clickSettlement')
      // this.$parent.$refs.paymode.mask.show()
    }
  }
}
</script>

<style>
.order-settlemet-wrapper {
  width: 750px;
  height: 120px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.order-info {
  width: 480px;
  height: 120px;
  padding-left: 20px;
  background: #fff;
}
.total-txt {
  font-weight: bold;
}
.total-value {
  font-weight: bold;
  color: #3795ff;
}
.order-count {
  color: #666;
  margin-top: 4px;
}
.total-price {
  width: 210px;
  height: 120px;
  line-height: 120px;
  padding-left: 40px;
  color: #fff;
  background: #3795ff;
}
</style>
